<template>
  <div class="home-container">
    <Layout>
      <Header class="layout-header">

      </Header>
      <Layout class="layout-container">
        <Sider class="layout-sider" hide-trigger>
          <Menu width="200px">
            <MenuItem name="1">
              环境
            </MenuItem>
          </Menu>
        </Sider>
        <Content class="layout-content">
          <environment-content></environment-content>
        </Content>
      </Layout>
    </Layout>
  </div>
</template>

<script>
import EnvironmentContent from "../components/EnvironmentContent";
import axios from "axios";
export default {
  name: "Home",
  components: {EnvironmentContent},
  created() {
    // let url ='https://api.github.com/repos/{username}/{repository}/releases/latest';
    // url = url.replace('{username}', 'coreybutler').replace('{repository}', 'nvm-windows');
    // axios.get(url).then(res => {
    //   const assets = res.data.assets;
    //   console.log(assets)
    // })
  }
}
</script>

<style lang="scss" scoped>
$header-height: 60px;

.home-container {
  min-height: 100vh;

  .layout-header {
    background-color: $theme-bg;
    height: $header-height;
  }

  .layout-container {
    min-height: calc(100vh - #{$header-height});
  }

  .layout-sider {
    width: 200px;
    background-color: $theme-bg;
  }

  .layout-content {
    padding: 20px;
    box-sizing: border-box;
  }
}
</style>
